import Vue from "vue";
import Vuex from "vuex"
import createPersistedState from "vuex-persistedstate";

Vue.use(Vuex);

// 创建仓库store
const store = new Vuex.Store({
    state: {
        token: '',
        cartData: [],
        userInfo: {}
    },
    // mutations是修改数据的唯一途径
    mutations: {
        setToken(state, token) {
            state.token = token
        },
        setUserInfo(state, userInfo) {
            state.userInfo = userInfo
        },
        clearInfo(state) {
            state.token = ''
            state.cartData = []
            state.userInfo = {}
        },
        // 清空购物车数据
        clearCartData(state) {
            state.cartData = [];
        },
        updateAvatar(state, newAvatar) {
            state.userInfo.avatar = newAvatar
        },
        // 往购物车添加商品
        addGoodsToCar(state, goods) {
            // 先判断是否有相同商品，有则累加数量，无直接追加到头部
            let index = state.cartData.findIndex(item => item.id === goods.id)
            console.log(index);
            if (index === -1) {
                state.cartData.unshift(goods)
            } else {
                // 累加数量即可
                state.cartData[index].number += goods.number
            }
        },
        // 删除购物车商品
        delCartGoods(state, id) {
            state.cartData = state.cartData.filter(item => item.id !== id)
        },
        // 设置购物车商品购买数量
        setGoodsNumber(state, {
            id,
            number
        }) {
            let index = state.cartData.findIndex(item => item.id === id)
            state.cartData[index].number = number
        },
        // 设置购物车商品选中状态
        setGoodsSeleceted(state, {
            id,
            selected
        }) {
            let index = state.cartData.findIndex(item => item.id === id)
            state.cartData[index].selected = selected
        },
    },
    actions: {},
    // 对vuex中的数据进行筛选处理之后在返回
    getters: {
        // 获取购物车商品的总数量
        getCarTotalNumber(state) {
            let totalNumber = 0;
            state.cartData.forEach(item => totalNumber += item.number)
            return totalNumber;
        },
        //获取以逗号分割的商品id 如 88,89
        getCarGoodsIds(state) {
            return state.cartData.map(item => item.id).join(',')
        },
        //获取选中商品
        getCarSelectGoodsIds(state) {
            return state.cartData.filter(item => item.selected).map(item => item.id).join(',')
        },
        // 步进器获取数值
        getGoodsNumberById(state) {
            let idNumMap = {};
            state.cartData.forEach(item => {
                idNumMap[item.id] = item.number
            })
            return idNumMap;
        },
        // 选中商品状态
        getGoodsStatusById(state) {
            let idSelectedMap = {};
            state.cartData.forEach(item => {
                idSelectedMap[item.id] = item.selected
            })
            return idSelectedMap;
        },
        // 获取选中商品数量的总价格
        getTotalPrice(state) {
            let totalPrice = 0;
            state.cartData.forEach(({
                sell_price,
                number,
                selected
            }) => selected && (totalPrice += number * sell_price))
            return totalPrice
        },
        // 获取选中商品数量
        getCarSelectedTotalNumber(state) {
            let totalNumber = 0;
            state.cartData.forEach(item => item.selected && (totalNumber += item.number))
            return totalNumber;
        },
    },
    plugins: [createPersistedState()]
})

// 暴露出去
export default store
